<%-- 
    Document   : 404
    Created on : Jan 2, 2013, 2:28:01 PM
    Author     : gcastillo, nbenavidez
--%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Pagina no encontrada</title>
<!-- Internet Explorer HTML5 enabling script: -->
<!--[if IE]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="css/404.css" />
</head>
<body>
<div id="rocket"></div>
<hgroup>
    <h1>Pagina no encontrada</h1>
    <h2>Lo que estas buscando no esta aqui!</h2>
</hgroup>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
   $(window).load(function(){
	
	// We are listening for the window load event instead of the regular document ready.
	
	function animSteam(){
		
		// Create a new span with the steam1, or steam2 class:
		
		$('<span>',{
			className:'steam'+Math.floor(Math.random()*2 + 1),
			css:{
				// Apply a random offset from 10px to the left to 10px to the right
				marginLeft	: -10 + Math.floor(Math.random()*20)
			}
		}).appendTo('#rocket').animate({
			left:'-=58',
			bottom:'-=100'
		}, 120,function(){
			
			// When the animation completes, remove the span and
			// set the function to be run again in 10 milliseconds
			
			$(this).remove();
			setTimeout(animSteam,10);
		});
	}
	
	function moveRocket(){
		$('#rocket').animate({'left':'+=100'},5000).delay(1000)
					.animate({'left':'-=100'},5000,function(){
				setTimeout(moveRocket,1000);
		});
	}

	// Run the functions when the document and all images have been loaded.
		
	moveRocket();
	animSteam();
});     
</script>
</body>
</html>